<template>
  <div style="padding: 20px">
    <a-range-picker
      :show-time="{ format: 'HH:mm' }"
      format="YYYY-MM-DD HH:mm"
      :placeholder="['开始时间', '结束时间']"
      @change="onChange"
    />
    <a-button @click="queryHistroyAlarm">查询</a-button>
    <div>
      <thing-tree ref="objTree" style="width: 300px;height:500px"></thing-tree>
      <alarm-table :alarms="alarms" style="margin-top: 10px"></alarm-table>
    </div>
  </div>
</template>
<script>
import alarmTable from "@/components/alarm/alarmTable.vue";
import { getAlarmHistory } from "@/services/alarmAPI.js";
import  ThingTree  from "@/components/data/thingTree/ThingTree.vue";
export default {
  name: "AlarmView",
  components: {
    alarmTable,
    ThingTree,
  },
  data() {
    return {
      alarms: [],
      dateRange: [],
    };
  },
  methods: {
    queryHistroyAlarm() {
      let _this = this;
      let uid = "";
      getAlarmHistory(uid, "", -1, this.dateRange[0], this.dateRange[1]).then(
        (data) => {
          _this.alarms = data;
        }
      );
    },
    onChange(value, dateString) {
      this.dateRange = dateString;
      console.log("Selected Time: ", value);
      console.log("Formatted Selected Time: ", dateString);
    },
  },
};
</script>
